<!-- Recipe Card -->
<div
  class="flex justify-between rounded-lg border border-gray-200 p-4 leading-normal"
>
  <div class="flex justify-between">
    <div class="flex">
      <a
        href="/admin/recipes/{{ .ID }}"
        hx-boost="true"
        hx-target="#page"
        hx-select="#page"
        class="mr-2"
      >
        <strong> {{ .Name }} </strong>
      </a>
      {{ .Description }}
    </div>
  </div>
  <button
    hx-delete="/admin/recipes/del?id={{ .ID }}"
    hx-confirm="Are you sure you want to delete this recipe?"
    hx-trigger="click"
    hx-target="#recipe-list"
    hx-select="#recipe-list"
    class="btn btn-danger"
  >
    ╳
  </button>
</div>
